<%--
  Created by IntelliJ IDEA.
  User: 谢兴鑫
  Date: 2022/5/13
  Time: 上午 09:56
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core"  prefix="c"%><!DOCTYPE html>
<html>
<head>
    <title>野鸡大学管理系统</title>
    <meta charset="utf-8">
    <link rel="shortcut icon" th:href="${pageContext.request.contextPath}/static/images/favicon.ico" type="image/x-icon">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <!-- 引入css -->
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/plugins/font-awesome-4.7.0/css/font-awesome.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/layui/css/layui.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/main.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/stulogin.css">
    <script type="text/javascript" src="${pageContext.request.contextPath}/static/js/jquery-3.5.1.min.js"></script>

    <script type="text/javascript" src="${pageContext.request.contextPath}/static/layui/layui.js"></script>
    <script>
        layui.use(['layer'],function () {
            var layer = layui.layer;
        });
        $(function () {
            // 页面初始化生成验证码
            window.onload = createCode('#loginCode');
            // 验证码切换
            $('#loginCode').click(function () {
                createCode('#loginCode');
            });
        });
        var code;
        // 生成验证码
        function createCode(codeID) {
            code = "";
            // 验证码长度
            var codeLength = 4;
            // 验证码dom元素
            var checkCode = $(codeID);
            // 验证码随机数
            var random = [0,1,2,3,4,5,6,7,8,9,'A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P','Q','R',
                'S','T','U','V','W','X','Y','Z'];
            for (var i = 0;i < codeLength; i++){
                // 随机数索引
                var index = Math.floor(Math.random()*36);
                code += random[index];
            }
            // 将生成的随机验证码赋值
            checkCode.val(code);
        }

        function check(){
            var inputCode = document.getElementById("loginCard").value.toUpperCase();
            var phone = $("#phone").val();
            var password = $("#password").val();
            if(inputCode =="" || phone == "" || password ==""){
                alert("输入的信息不完善!");
                return false;
            } else if(inputCode!=code){
                alert("验证码错误！");
                location.reload();
                createCode();
                document.getElementById("loginCard").value = "";
                return false
            }
            return true;
        }

    </script>


</head>
<body class="layui-layout-login">
<div class="login-bg">
    <div class="cover"></div>
</div>
<div class="login-content">
    <h1 class="login-box-title">学生登录</h1>
    <input type="hidden" name="message" id="message" value="${message}">
    <input type="hidden" name="messages" id="messages" value="${messages}">
    <script>
        let message = $("#message").val();
        let messages = $("#messages").val();
        if(message!=null || message != ''){
            layer.msg(message,{time: 40000});
        }
        if (messages!=null || messages != ''){
            layer.msg(messages,{time: 3000});
        }
    </script>
    <%--  onsubmit="return check()--%>
    <form class="layui-form" action="${pageContext.request.contextPath}/studentLogin/goindex">
        <div class="layui-form-item">
            <label class="layui-icon layui-icon-username" for="phone"></label>
            <input class="layui-input" type="text" name="phone" id="phone" placeholder="账号">
        </div>
        <div class="layui-form-item">
            <label class="layui-icon layui-icon-password" for="password"></label>
            <input class="layui-input" type="password" name="password" id="password" placeholder="密码">
        </div>
        <div class="layui-form-item">
            <label class="layui-icon layui-icon-vercode" for="loginCard"></label>
            <input class="layui-input"  style="cursor:pointer;width: 150px;height: 36px;margin: 0px 0 0 0px;border-radius: 3px;" type="text" name="card" id="loginCard" placeholder="验证码">
        </div>
        <div class="codeDiv">
            <input id="loginCode" style="position: absolute;top: 200px;right: 40px" class="layui-input codeInput"  type="button">
        </div>
        <div class="layui-form-item">

            <input type="checkbox" name="rememberMe" title="记住我" lay-skin="primary"><div class="layui-unselect layui-form-checkbox" lay-skin="primary"><span>记住我</span><i class="layui-icon layui-icon-ok"></i></div>
            <a style="left: 100px" class="layui-layout-right forget-password" href="${pageContext.request.contextPath}/index.jsp">教师登录?</a>

            <a class="layui-layout-right forget-password" href="javascript:alert('请联系超级管理员！')">忘记密码?</a>
        </div>
        <button  type="submit" class="layui-btn layui-btn-fluid ajax-submit">登录
        </button>
    </form>
</div>
</body>
</html>
